<!DOCTYPE html>
<html lang="zh-cn">
 
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
        <title>verify插件demo</title>
        <link rel="stylesheet" type="text/css" href="css/verify.css">
    </head>
 
    <body>
    	 
    	
    	 
    	
    	 
        
        <div id="mpanel4" style="margin-top:50px;">
        </div>
        
        <div id="mpanel5" style="margin-top:50px;">
        </div>
        
        
        
        <script type="text/javascript" src="js/jquery.min.js" ></script>
        <script type="text/javascript" src="js/verify.js" ></script>
        <!--<script type="text/javascript" src="js/verify.min.js" ></script>-->
        
        <script>
        	
        	 
		    
		    $('#mpanel4').slideVerify({
		    	type : 2,		//类型
        		vOffset : 5,	//误差量，根据需求自行调整
		        vSpace : 5,	//间隔
		        imgName : [],
		        imgSize : {
		        	width: '400px',
		        	height: '200px',
		        },
		        blockSize : {
		        	width: '80px',
		        	height: '80px',
		        },
		        barSize : {
		        	width : '400px',
		        	height : '40px',
		        },
		        ready : function() {
		    	},
		        success : function(obj) {
		        	prompt('验证成功，提交数据加上这个token:::',obj.token);
		        },
		        error : function() {
//		        	alert('验证失败！');
		        }
		        
		    });
		    
		    $('#mpanel5').pointsVerify({
		    	imgSize : {
		        	width: '400px',
		        	height: '200px',
		        },
		        barSize : {
		        	width : '400px',
		        	height : '40px',
		        },
		        ready : function() {
		    	},
		        success : function(obj) {
		        	prompt('验证成功，提交数据加上这个token:::',obj.token);
		        },
		        error : function() {
//		        	alert('验证失败！');
		        }
		        
		    }); 
		    
        </script>
    </body>
 
</html>